<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="utf-8">
    <title>物品记录管理</title>
    <link rel="icon" href="../fffff.ico">
    <link rel="stylesheet" href="../layui/css/layui.css"/>
    <link rel="stylesheet" href="../css/my.css"/>
</head>

<style type="text/css">
    /**
    使表格里面的图片以正常格式显示
     */
    .layui-table-cell {
        text-align: center;
        height: auto;
        white-space: normal;
    }

    .layui-table img {
        max-width: 100%;
    }
</style>

<body>
<ul class="layui-nav layui-bg-green " lay-filter="" style="width: 1900px">

    <li class="layui-nav-item layui-this my" id="user">你好：</li>
    <li class="layui-nav-item"><a href="/changepwd">修改密码</a></li>
    <li class="layui-nav-item"><a onclick="log()" style="cursor: pointer;">退出</a></li>
    <li class="layui-nav-item" style="float: right;margin-top: 3px">
        <div class="layui-inline">
            <div class="layui-input-inline">
                <a href="javascript:void(0);" style="margin-right: 6px;display: block;cursor: pointer;"
                   id="search">搜索</a>
            </div>
            <div class="layui-input-inline" style="width: 100px;">
                <input type="text" name="" autocomplete="off" placeholder="名称搜索" id="searin" class="layui-input">
            </div>
        </div>
    </li>
</ul>
<div style="width: 1850px">
    <div style="float: left;margin-top: 14px;">
        <ul class="layui-nav layui-nav-tree layui-inline" lay-filter="demo" style="margin-right: 10px;height: 750px;width: 139px">
            <li class="layui-nav-item"><a href="/info">物品管理</a></li>
            <li class="layui-nav-item" style="background-color: #4e5465;"><a href="/thing">物品图片</a></li>
            <li class="layui-nav-item" ><a href="/eve">每日的事</a></li>
            <li class="layui-nav-item"><a href="/password">密码管理</a></li>
        </ul>
    </div>
    <div style="float: left;width: 1700px;margin-left: 0px;">
        <table class="layui-hide" id="test" lay-filter="t"></table>
    </div>

</div>


<script src="../layui/layui.all.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!--<script src="../js/info.js"></script>-->

<!--<script type="text/html" id="toolbarDemo">-->
<!--    <div class="">-->
<!--        <button class="layui-btn layui-btn-sm" lay-event="getCheckData">删除选中</button>-->
<!--    </div>-->
<!--</script>-->


<!--lay.js必须在删除下面-->
<script >
    layui.use(['table', 'upload'], function () {
        var table = layui.table;
        var $ = layui.jquery
            , upload = layui.upload;

        table.render({
            elem: '#test'
            , url: '/pic/page'
            // , toolbar: '#toolbarDemo'
            // , height: '35'
            , cols: [[
                // {type: 'checkbox'},
                {field: 'goodName', title: '名称', width: 85}
                , {field: 'time', width: 250, title: '时间'}
                , {field: 'address', title: '图片', templet: '<div><img  src="{{d.address}}" title="{{d.detail}}" style="width: 480px;height: 240px;"/></div>'}
                , {fixed: 'right', width: 210, toolbar: '#barDemo'}
            ]],
            id: 'idTest',
            parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": res.data //解析数据列表
                };
            }
            , page: true
            , method: "post"
            , limits: [1, 2, 3, 4, 5]
            , limit: 3
        });
        //头工具栏事件 这里没有这个
        table.on('toolbar(t)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            switch (obj.event) {
                case 'getCheckData':
                    var data = checkStatus.data;
                    layer.confirm('点击确定删除?', {icon: 3, title: '提示'}, function (index) {
                        //do something
                        $.ajax({
                            url: "/goods/deletes",
                            type: 'POST',
                            data: JSON.stringify(data),
                            dataType: 'json',
                            contentType: 'application/json;charset=UTF-8',
                            success: function (data) {
                                if (data.success) {
                                    layer.msg(data.msg);
                                    $(".layui-laypage-btn").trigger("click");
                                } else {
                                    layer.msg(data.msg);
                                }
                            }
                        });
                        layer.close(index);
                    });


                    // layer.alert(JSON.stringify(data));
                    break;
                case 'getCheckLength':
                    var data = checkStatus.data;
                    layer.msg('选中了：' + data.length + ' 个');
                    break;

                //自定义头工具栏右侧图标 - 提示
                case 'LAYTABLE_TIPS':
                    layer.alert('这是工具栏右侧自定义的一个图标按钮');
                    break;
            }
            ;
        });


        //监听工具条
        table.on('tool(t)', function (obj) {
                console.log(obj);
                console.log(obj.data.goodId);
                var data = obj.data;
                if (obj.event === 'del') {
                    layer.confirm('点击确定删除数据', function (index) {

                        $.ajax({
                            url: "/pic/delete/" + obj.data.goodId,
                            type: 'POST',
                            contentType: false,
                            processData: false,
                            cache: false,
                            success: function (data) {
                                if (data.success) {
                                    obj.del();
                                    $(".layui-laypage-btn").trigger("click");
                                    layer.msg('删除成功');

                                } else {
                                    // $(".layui-laypage-btn").trigger("click");
                                    layer.msg(data.msg+",无法操作");

                                }
                            }
                        });
                        layer.close(index);
                    });
                } else if (obj.event === 'edit') {
                    // layer.alert('编辑行：<br>' + JSON.stringify(data))
                    console.log(obj.data.goodId);
                    layer.open({
                        type: 2,
                        content: '/up?goodId=' + obj.data.goodId,
                        area: ['530px', '450px'],
                        resize: false,
                        cancel: function () {
                            $.ajax({
                                url: "/goods/info",
                                type: 'POST',
                                dataType: 'json',
                                contentType: false,
                                processData: false,
                                cache: false,
                                success: function (data) {
                                    if (data.success) {
                                        // window.parent.location.reload();
                                        $(".layui-laypage-btn").trigger("click");
                                    } else {
                                        layer.msg(data.msg);
                                    }
                                }
                            })
                        }
                    })

                }
            }
        );
    });
    $("#search").click(function () {
        // layer.msg($("#searin").val());
        var table = layui.table;

        table.reload('idTest', {
            url: '/pic/page',
            where: {
                name: $("#searin").val()
            },
            page: {
                curr: 1
            }
        });

    })
    function log() {

        layer.confirm('点击确定退出登录', {icon: 3, title: '提示'}, function (index) {
            //do something
            $.ajax({
                url: "/user/logout",
                type: 'POST',
                contentType: false,
                processData: false,
                cache: false,
                success: function (data) {
                    if (data.success) {
                        layer.msg('退出成功');
                        setTimeout(function () {
                            window.location.href = "/login";
                        }, 800);
                    } else {
                        layer.msg(data.msg);
                    }
                }
            });
            layer.close(index);
        });
    }
    $(function () {

        $.ajax({
            url: "/goods/name",
            type: 'POST',
            dataType: 'json',
            contentType: false,
            processData: false,
            cache: false,
            success: function (data) {
                if (data.success) {

                    $("#user").text("你好:" + data.data.userName);
                } else {
                    layer.msg(data.msg);
                }
            }
        });


    })

</script>


<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">上传图片</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除图片</a>
</script>
</body>
</html>
